<template>
  <van-nav-bar title="物流详情" left-text="" left-arrow @click-left="goBack" />
  <section class="aui-flexView">
    <!-- 订单详细 -->
    <section class="aui-scrollView">
      <!-- 订单状态 -->
      <div class="aui-pay-change">
        <div class="aui-flex">
          <div class="aui-flex-box">
            <h3>{{ info.status_text }}</h3>
          </div>
          <div class="aui-pay-zfb">
            <img src="/assets/images/icon-zfb.png" alt="" />
          </div>
        </div>
      </div>

      <!-- 收货地址 -->
      <div class="aui-flex">
        <div class="aui-flex-add">
          <van-image round fit :src="LoginUser.avatar" />
        </div>
        <div class="aui-flex-box">
          <h3>
            {{ info.consignee }} <em>{{ info.mobile }}</em>
          </h3>
          <p>{{ info.address_text }}</p>
        </div>
      </div>

      <!-- 物流信息 -->
      <van-steps direction="vertical" :active="0">
        <van-step  v-for="item in info.express">
          <h3>{{ item.status }}</h3>
          <p>{{ item.time }}</p>
        </van-step>
      </van-steps>
    </section>
  </section>
</template>
<script setup>
const route = useRoute();
const { cookies } = useCookies();
const goBack = () => {
  history.back();
};
const orderid = ref(route.query.orderid ?? 0);
const info = ref({});
const LoginUser = reactive(cookies.get("LoginUser"));
onBeforeMount(() => {
  getInfoData();
});
const getInfoData = async () => {
  let result = await Api.business.orderInfo({
    orderid: orderid.value,
    busid: LoginUser.id,
  });
  if (result.code == 1) {
    info.value = result.data;
  } else {
			showFailToast(result.msg);
		}
};
</script>
<style scoped>
@import url("/assets/css/info.css");
</style>